<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title th:text="${title} + ' - 应急响应中心管理系统'">页面标题 - 应急响应中心管理系统</title>
    
    <!-- 通用样式 -->
    <link rel="stylesheet" th:href="@{/css/main.css}">
    <link rel="stylesheet" th:href="@{/lib/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/lib/bootstrap-icons/font/bootstrap-icons.css}">
    
    <!-- 页面特定样式 -->
    <th:block th:replace="${pageStyles} ?: ~{}">
        <!-- 页面特定的样式将在这里插入 -->
    </th:block>
</head>
<body>
    <!-- 使用通用导航栏 -->
    <div th:replace="~{fragments/header :: navbar}"></div>

    <!-- 页面头部 -->
    <header class="header" th:if="${showHeader}">
        <div class="container">
            <h1 th:text="${pageTitle}">页面标题</h1>
            <p th:text="${pageSubtitle}">页面副标题</p>
        </div>
    </header>

    <!-- 页面内容 -->
    <div class="container content">
        <th:block th:replace="${content}">
            <!-- 页面内容将在这里插入 -->
        </th:block>
    </div>

    <!-- 页面底部 -->
    <footer class="footer" th:if="${showFooter}">
        <div class="container">
            <p>&copy; 2025 应急响应中心管理系统 保留所有权利</p>
        </div>
    </footer>

    <!-- 引入认证管理脚本 -->
    <script th:src="@{/js/auth.js}"></script>
      <script th:src="@{/js/navbar.js}"></script>
    
    <!-- 页面特定脚本 -->
    <th:block th:replace="${pageScripts} ?: ~{}">
        <!-- 页面特定的脚本将在这里插入 -->
    </th:block>

    <!-- 通用页面初始化脚本 -->
    <script th:fragment="pageInit">
        document.addEventListener('DOMContentLoaded', function() {
            // 等待认证管理器初始化
            const checkAuth = () => {
                console.log('base.html: 检查AuthManager初始化');
                if (window.AuthManager) {
                    console.log('base.html: AuthManager已初始化，开始初始化页面');
                    initPage();
                } else {
                    console.log('base.html: AuthManager未初始化，等待...');
                    setTimeout(checkAuth, 100);
                }
            };
            checkAuth();
        });

        function initPage() {
            console.log('base.html: 开始初始化页面');
            const userInfo = window.AuthManager.getUserInfo();
            console.log('base.html: 获取到的用户信息:', userInfo);
            
            if (!userInfo) {
                console.log('base.html: 用户信息不存在，检查token...');
                const token = window.AuthManager.getToken();
                console.log('base.html: Token存在:', !!token);
                
                if (!token) {
                    console.log('base.html: Token不存在，跳转到登录页');
                    window.location.href = '/ercms/login';
                    return;
                } else {
                    console.log('base.html: Token存在但用户信息不存在，尝试重新加载');
                    window.AuthManager.userInfo = JSON.parse(localStorage.getItem('user_info') || 'null');
                    console.log('base.html: 重新加载后的用户信息:', window.AuthManager.userInfo);
                    
                    if (!window.AuthManager.userInfo) {
                        console.log('base.html: 重新加载后仍无用户信息，跳转到登录页');
                        window.location.href = '/ercms/login';
                        return;
                    }
                }
            }

            console.log('base.html: 认证检查通过，检查页面权限');
            // 检查页面权限
            if (typeof checkPagePermission === 'function') {
                if (!checkPagePermission(userInfo)) {
                    console.log('base.html: 权限不足，跳转到首页');
                    alert('您没有权限访问此页面');
                    window.location.href = '/ercms/dashboard';
                    return;
                }
            }

            console.log('base.html: 权限检查通过，调用页面特定初始化');
            // 调用页面特定的初始化函数
            if (typeof pageInit === 'function') {
                pageInit(userInfo);
            }
        }
    </script>
</body>
</html> 